import 'package:flutter/material.dart';

void main() {
  runApp(const ThemeExampleApp());
}

class ThemeExampleApp extends StatelessWidget {
  const ThemeExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter主题示例',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
      ),
      home: const ThemeTestRoute(),
    );
  }
}

class ThemeTestRoute extends StatefulWidget {
  const ThemeTestRoute({super.key});

  @override
  State<ThemeTestRoute> createState() => _ThemeTestRouteState();
}

class _ThemeTestRouteState extends State<ThemeTestRoute> {
  var _themeColor = Colors.teal; // 当前路由主题色

  @override
  Widget build(BuildContext context) {
    ThemeData themeData = Theme.of(context);
    return Theme(
      data: ThemeData(
        primarySwatch: _themeColor, // 用于导航栏、FloatingActionButton的背景色等
        iconTheme: IconThemeData(color: _themeColor), // 用于Icon颜色
      ),
      child: Scaffold(
        appBar: AppBar(
          title: const Text("主题测试"),
          backgroundColor: _themeColor,
          foregroundColor: Colors.white,
        ),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 第一行Icon使用主题中的iconTheme
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: const <Widget>[
                Icon(Icons.favorite),
                Icon(Icons.airport_shuttle),
                Text("  颜色跟随主题"),
              ],
            ),
            const SizedBox(height: 20),
            // 为第二行Icon自定义颜色（固定为黑色)
            Theme(
              data: themeData.copyWith(
                iconTheme: themeData.iconTheme.copyWith(color: Colors.black),
              ),
              child: const Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Icon(Icons.favorite),
                  Icon(Icons.airport_shuttle),
                  Text("  颜色固定黑色"),
                ],
              ),
            ),
            const SizedBox(height: 40),
            // 颜色转换示例
            _buildColorConversionExample(),
            const SizedBox(height: 20),
            // 颜色亮度示例
            _buildColorBrightnessExample(),
          ],
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            // 切换主题
            setState(() {
              _themeColor =
                  _themeColor == Colors.teal ? Colors.blue : Colors.teal;
            });
          },
          child: const Icon(Icons.palette),
        ),
      ),
    );
  }

  // 颜色转换示例
  Widget _buildColorConversionExample() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.grey),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Column(
        children: [
          const Text(
            "颜色转换示例",
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 10),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              Container(
                width: 50,
                height: 50,
                color: const Color(0xffdc380d), // 直接使用整数值
                child: const Center(
                  child: Text("1", style: TextStyle(color: Colors.white)),
                ),
              ),
              Container(
                width: 50,
                height: 50,
                color: Color(
                  int.parse("dc380d", radix: 16) | 0xFF000000,
                ), // 通过位运算符
                child: const Center(
                  child: Text("2", style: TextStyle(color: Colors.white)),
                ),
              ),
              Container(
                width: 50,
                height: 50,
                color: Color(
                  int.parse("dc380d", radix: 16),
                ).withAlpha(255), // 通过方法
                child: const Center(
                  child: Text("3", style: TextStyle(color: Colors.white)),
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 颜色亮度示例
  Widget _buildColorBrightnessExample() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.grey),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Column(
        children: [
          const Text(
            "颜色亮度示例",
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 10),
          _buildColorWithText("深色背景", Colors.indigo),
          const SizedBox(height: 10),
          _buildColorWithText("浅色背景", Colors.yellow),
        ],
      ),
    );
  }

  Widget _buildColorWithText(String text, Color backgroundColor) {
    // 计算背景色的亮度
    double luminance = backgroundColor.computeLuminance();
    // 根据亮度决定文字颜色
    Color textColor = luminance > 0.5 ? Colors.black : Colors.white;

    return Container(
      width: double.infinity,
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: backgroundColor,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Text(
        text,
        style: TextStyle(
          color: textColor,
          fontSize: 16,
          fontWeight: FontWeight.bold,
        ),
        textAlign: TextAlign.center,
      ),
    );
  }
}

// 全局主题切换示例
class GlobalThemeApp extends StatefulWidget {
  const GlobalThemeApp({super.key});

  @override
  State<GlobalThemeApp> createState() => _GlobalThemeAppState();
}

class _GlobalThemeAppState extends State<GlobalThemeApp> {
  bool _isDarkMode = false;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '全局主题切换示例',
      theme: _isDarkMode ? ThemeData.dark() : ThemeData.light(),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('全局主题切换'),
          actions: [
            IconButton(
              icon: Icon(_isDarkMode ? Icons.light_mode : Icons.dark_mode),
              onPressed: () {
                setState(() {
                  _isDarkMode = !_isDarkMode;
                });
              },
            ),
          ],
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              const Icon(Icons.home, size: 64),
              const SizedBox(height: 16),
              const Text('点击右上角按钮切换主题'),
              const SizedBox(height: 32),
              ElevatedButton(onPressed: () {}, child: const Text('按钮示例')),
              const SizedBox(height: 16),
              const Card(
                child: Padding(
                  padding: EdgeInsets.all(16),
                  child: Text('卡片示例'),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
